<!DOCTYPE html>
<html>

<head>
    <title>角色管理</title>
</head>

<body>

<div class="page-header">
    <h1>${_resource_name!''}
        <small><i class="ace-icon fa fa-angle-double-right"></i>
            角色列表
        </small>
    </h1>
</div><!-- /.page-header -->

<div class="row">
    <div class="col-xs-12">
        <!-- PAGE CONTENT BEGINS -->
        <!-- button 区域 -->
        <@shiro.hasPermission name="${ctlKey}:add">
        <@tbHeaderBtn l="add" />
        </@shiro.hasPermission>
        <@shiro.hasPermission name="${ctlKey}:pagination">
        <@tbHeaderBtn l="search" />
        </@shiro.hasPermission>
        <div class="hr hr-18 dotted hr-double"></div>
        <!-- PAGE CONTENT BEGINS -->
        <table id="dataTable" cellspacing="0" width="100%" class="table table-striped table-bordered table-hover"></table>
        <!-- PAGE CONTENT ENDS -->
    </div><!-- /.col -->
</div><!-- /.row -->
<div id="operateTxt">
    <@tbTableBtn l="edit,delete"/>
</div>
<form id="searchForm" >
    <div id="searchBox" >
        <div class="row">
            <div class="col-xs-12">
                <div class="widget-box">
                    <div class="widget-body">
                        <div class="widget-main">
                            <div>
                                <label for="form-field-1">key</label>
                                <input id="form-field-1" name="roleKey" type="text" class="form-control"  value="${old_roleKey!}"/>
                            </div>
                            <div class="space space-8"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>
</body>
<my_script>
    <script src="/assets/js/jquery.serializejson.js"></script>
    <!-- page specific plugin scripts -->
    <script src="/assets/js/jquery.dataTables.min.js"></script>
    <script src="/assets/js/jquery.dataTables.bootstrap.min.js"></script>
    <script src="/common/js/jquery.dataTables.default.js"></script>
    <!-- bootbox scripts -->
    <script src="/common/js/bootbox.js"></script>
    <!-- end bootbox scripts -->
    <!-- inline scripts related to this page -->
    <script type="text/javascript">
        var tables = $('#dataTable').DataTable({
            columns: [
                {data:'roleKey',title:'key', className:"center"},
                {data:'description',title:'说明', className:"center"},
                {data:'roleName',title:'角色名称', className:"center"},
                {data:null, title:"",className:"center", width:150,
                    render: function ( data, type, full, meta ) {
                        return $.format($("#operateTxt").html(), full.id);
                    }
                }
            ]
        });
    </script>
</my_script>

</html>